<template>
    <div>
        <!-- :dialog-style="{ top: '20px' }" -->
        <a-modal
            title="查看申请信息"
            :visible="applicationVisible"
            @ok="applicationVisible = false"
            @cancel="applicationVisible = false"
            :footer="null"
            width="100%"
            class="application-eaySQXX-modal-box"
        >
            <a-spin size="large" :spinning="modalSpinningPrice" tip="正在加载中...">
                <div class="process-handling-card">
                    <a-tabs type="card" v-model:activeKey="activeKey" @change="tabPaneChange" v-if="tabList.length">
                        <a-tab-pane v-for="(item,index) in tabList" :key="index" :tab="item.fslbh"></a-tab-pane>
                        <!-- +'--'+item.fsxmc -->
                    </a-tabs>
                </div>
                <eventSet :key="eventSetKey" ref="eventSetRef" @updatedSuccess="eventupdatedSuccess"/>
            </a-spin>
        </a-modal>
    </div>
</template>
<script>
import eventSet from '../taskAcceptance/eventSet.vue'
import {
    hbjcqueryHbzsxList,
    spcyquerySqsxDetailsById,
} from './service/index'
import moment from 'moment'
export default {
    components:{
        eventSet,
    },
    props:{

    },
    data(){
        return{
            applicationVisible:false,
            modalSpinningPrice:false,
            eventSetKey:null,
            tabList:[],
            activeKey:0,
        }
    },
    watch:{

    },
    mounted(){
        
    },
    methods:{
        getDatas(row,val){
            this.modalSpinningPrice = true
            hbjcqueryHbzsxList({sqsxid:row.sqsxid}).then(res=>{
                if(res.code == 200){
                    //console.log(res.result)
                    if(res.result && res.result.records.length){
                        this.tabList = res.result.records
                        this.getDeisl()
                    }else{
                        this.getYsData(row)
                    }
                }else{
                    this.getYsData(row)
                }
            })
            
        },
        getYsData(row){
            
            this.$nextTick(()=>{
                setTimeout(()=>{
                    this.$refs.eventSetRef.getDatas({...row,boxHeight:65,borderisFalse:false})
                },200)
            })
        },
        getDeisl(val){
            spcyquerySqsxDetailsById({sqsxid:this.tabList[val?val:0].id}).then(res=>{
                if(res.code == 200){
                    //console.log(res)
                    let data = res.result
                    let sqsx = res.result.sqsx
                    let setOfData = {
                        fywflcode:'001002',
                        ...res.result,
                        jobid:'',
                        fblzt:'',
                        fthyj:'',
                        ...sqsx,
                        sqsxid:sqsx.id,
                        fslzt:String(sqsx.fslzt),
                        fsqsj:sqsx.fsqsj?moment(sqsx.fsqsj).format('YYYY-MM-DD'):'',
                        fslsj:sqsx.fslsj?moment(sqsx.fslsj).format('YYYY-MM-DD'):'',
                        isOwn:true,
                        dbrid:[],
                        opinion:'',//办理意见
                        smgflag:false,//是否发送短信
                        ...data.qy,
                        fqymc:sqsx.fqymc,
                        isTabs:true,
                        commpStepIndex:0,
                    }
                    this.$nextTick(()=>{
                        setTimeout(()=>{
                            this.modalSpinningPrice = true
                            this.$refs.eventSetRef.getDatas({...setOfData,boxHeight:65,tabPaneActiveKey:'申请信息',isTabs:false,borderisFalse:false})
                        },200)
                    })
                }
            })
        },
        tabPaneChange(val){
            this.getDeisl(val)
        },
        eventupdatedSuccess(){
            this.modalSpinningPrice = false
        },

    }
}
</script>
<style lang="less">
.application-eaySQXX-modal-box{
    .ant-modal {
        max-width: 100%;
        top: 0;
        padding-bottom: 0;
        margin: 0;
    }
    .ant-modal-content {
        display: flex;
        flex-direction: column;
        height: calc(100vh);
        // background: #fff;
    }
    .ant-modal-body {
        flex: 1;
        background: #f4f7fc !important;
        padding: 0;
        height: calc(100vh - 50px);
    }
}
</style>